<script setup>
import {conUtils} from "../../utils/conUtils";
import {
  onAddToFavorites,
  onHide,
  onLoad,
  onShareAppMessage,
  onShareTimeline,
  onShow,
  onUnload
} from "@dcloudio/uni-app";
import {getNewTimeV2} from "../../utils/date";
import {number} from "uview-plus/libs/function/test";
import index from "../index/index.vue";
import {BaseImgUrl, BaseURL} from "../../utils/lshttp";
import {useUserInfoStore} from "../../stores/modules/userInfo";
const userInfoStore = useUserInfoStore()

import {useCommonInfoStore} from "../../stores/modules/commonInfo";
const commonInfoStore = useCommonInfoStore()
const { twoFixed } = useCommonInfoStore()
//console.log('commonInfoStore==',commonInfoStore)

import {onMounted, onUnmounted, ref, watch} from "vue";
import LszbgCountDown from "../../components/LszbgCountDown.vue";
import {getBuToPagePath, toMiniAppOrderPage, toMiniAppRedPage} from "../../utils/utils";
import {deleteOrderAPI, getOrderProcessAPI, oneKeyCuiShenAPI} from "../../services/order";
import {useOrder} from "./use_order";
const { paging } = useOrder
const userInfo = userInfoStore.userInfo
// 新用户变量
const newUser = ref()
const props = defineProps({item: Object, orderIndex: Number, source: String, activeMorenIndex: Number,})

const emits = defineEmits([
    'handleResumeOrder',
  'handleTwoOrder',
  'handleUpload',
  'cancelOrder',
  'handleUploadOrderNo',
  'goShop',
  'reasonForrejection',
  'handleSaveUserPayOrderNo',
  'setMore',
])

const handleResumeOrder = async (item, orderIndex) => {
  emits('handleResumeOrder', item, orderIndex,)
}
const handleTwoOrder = async (item, activityId) => {
  emits('handleTwoOrder', item, activityId)
}
const handleUpload = async (id, source) => {
  emits('handleUpload', id, source)
}
const cancelOrder = async (item) => {
  emits('cancelOrder', item)
}
const handleUploadOrderNo = async (id, source) => {
  emits('handleUploadOrderNo', id, source)
}
const goShop = async (item) => {
  emits('goShop', item)
}
// 查看审核不过的原因
const reasonForrejection = async (item) => {
  emits('reasonForrejection', item)
}
const handleSaveUserPayOrderNo = async (item) => {
  emits('handleSaveUserPayOrderNo', item)
}
// 一键催审
const oneKeyCuiShenFun = async (item) => {
  emits('oneKeyCuiShenFun', item)
}
// 创建一个选择器查询对象，用于后续的DOM操作
const query = uni.createSelectorQuery();

//倒计时计算
const format = ref("HH:mm:ss")
const findcountdown = (item) => {
  conUtils("findcountdown")
  let nowTime = +new Date()
  let putTime = +new Date(item.end_time.replace(/-/g, "/"))
  if (item?.isLocalControl) {
    conUtils("getNewTimeV2(10)")
    putTime = getNewTimeV2(10)
  }
  return (putTime - nowTime)
}
// 抢单未上传订单号倒计时30分钟
const findcountdownThere = (item) => {
  conUtils("findcountdownThere")
  let nowTime = +new Date();
  let putTime = +new Date(item.end_time.replace(/-/g, "/"));
  if (item?.isLocalControl) {
    putTime = getNewTimeV2(10)
  }
  return (putTime - nowTime)
}
// 跳转美团h5页面
const gotoMeituanPage = async (item) => {
  console.log("item===",item)
  uni.navigateTo({
    url: "/pages_order/meituan-webview?&id=" + item.id
  })
}
// 图标分享事件
const showShare = ref(false)
// 获取选中分享的订单内容
const shareClickData = ref()
/* H5测试用 */
const H5Click = async (item) => {
  uni.navigateTo( {
    url: '/pages_shopdetail/shopdetail?id=' + item.shop.id + '&activeIndex=0' + "&applet=1&showShare=true"
  })
}
const share = (item) => {
  shareClickData.value = ''
  if (item){
    shareClickData.value = item
  }
  console.log('商家详情==', shareClickData.value.activity)
  /* #ifdef APP-PLUS || MP */
  showShare.value = true
  /* #endif */
  /* #ifdef H5 */
  uni.navigateTo( {
    url: '/pages_shopdetail/shopdetail?id=' + item.shop.id + '&activeIndex=0' + "&applet=1&showShare=true"
  })
  /* #endif */


}
const popupClose = () => {
  console.log('关闭=', showShare.value)
  showShare.value = false
}
const currentIcon = ref("share-fill") //初始图标为分享
// 切换图标事件
const startImageCycle = () => {
  if (currentIcon.value === "share-fill"){
    currentIcon.value = "weixin-fill"
  } else {
    currentIcon.value = "share-fill"
  }
}
// 单条订单数据
const orderItemData = ref()
const orderItemId = ref()

onMounted( () => {
  orderItemData.value = props.item
  orderItemId.value = props.item.id
  // 判断是否新用户
  if (userInfoStore.isNewUser){
    newUser.value = '新用户'
  }else {
    newUser.value = '老用户'
  }
  // orderItemData.value.isSelected = 2
  // console.log('来源1=', props.source)
  setInterval(() => {
    startImageCycle()
  }, 3000)
  // #ifdef H5
  // await wxShare()
  // #endif
})
watch( () => props.activeMorenIndex,(newVal, oldValue) => {
  // console.log('改变了索引=', newVal)
  activeIndex.value = newVal
})
// 抢购金额=最低消费-会员补贴
const takeMoney = ref(0)
const useUser = useUserInfoStore()

// WEIXIN转发到聊天界面onShareAppMessage
onShareAppMessage((res) => {
  console.log("item===",res.target.dataset.share)
  let { shopName, shopId, imageUrl, activity} = res.target.dataset.share
  takeMoney.value = activity.minimum_amount - activity.member_rebate_amount
  const message = ref("您的好友给你推荐了（" + shopName + "），预计花费 ￥" + takeMoney.value + "元")
  return commonInfoStore.setWxShareMessage("message", message.value, useUser?.userInfo?.id, "/pages/index/index?parent_id=" + userInfoStore.userInfo?.id + "&type=1&shopId=" + shopId + "&source=2", imageUrl, 2);
  /* if (res.from === 'button'){
    //console.log('分享的触发方式=', res)
    return {
      title: "您的好友给你推荐了（" + shopName + "），预计花费 ￥" + takeMoney.value + "元",
      imageUrl: imageUrl || BaseImgUrl + "/share/share_bg.png",
      path: "/pages/index/index?parent_id=" + userInfoStore.userInfo.id + "&type=1&shopId=" + shopId + "source=2",
      type: 0, // 0=正式服，1=测试服，2=体验版
      success:function(res){
      //成功回调
      console.log("分享成功")
      }
    }
  } */
})

// WEIXIN转发到朋友圈
const ShareTimeLine = ((res) => {
  console.log("item===",res)
  uni.navigateTo( {
    url: '/pages_shopdetail/shopdetail?id=' + res.shop.id + '&activityId=' + res.activity.id  + "&orderShareShow=true" + "&newUser=" + newUser.value
  })
})


// APP分享到微信好友
const handleShareWechat = () => {
  console.log("item===",shareClickData.value)
  takeMoney.value = shareClickData.value.activity.minimum_amount - shareClickData.value.activity.member_rebate_amount
  uni.share({
    provider: "weixin",
    scene: "WXSceneSession",
    type: 5,
    miniProgram: {
      id: "gh_45626294c5df",
      path: "/pages/index/index?parent_id=" + userInfoStore.userInfo.id + "&type=1&shopId=" + shareClickData.value.shop.id + "source=2",
      webUrl: BaseURL + '/#/?parent_id=' + userInfoStore.userInfo.id + "&type=1&shopId=" + shareClickData.value.shop.id + "source=2",
      // TODO
      // type: 1
    },
    href: BaseURL + '/#/?parent_id=' + userInfoStore.userInfo.id + "&type=1&shopId=" + shareClickData.value.shop.id + "source=2",
    title: "您的好友给你推荐了（" + shareClickData.value.shop.name + "），预计花费 ￥" + takeMoney.value + "元",
    summary: "您的好友给你推荐了（" + shareClickData.value.shop.name + "），预计花费 ￥" + takeMoney.value + "元",
    imageUrl: shareClickData.value.shop.logo || BaseImgUrl + "/share/share_bg.png",
    success: function (res) {
      console.log("success:" + JSON.stringify(res));
    },
    fail: function (err) {
      console.log("fail:" + JSON.stringify(err));
    }
  });
}
// APP分享到朋友圈
const handleShareTimeline = () => {
  console.log("item===",shareClickData.value)
  takeMoney.value = shareClickData.value.activity.minimum_amount - shareClickData.value.activity.member_rebate_amount
  uni.share({
    provider: "weixin",
    scene: "WXSceneTimeline",
    type: 0,
    href: BaseURL + '/#/?parent_id=' + userInfoStore.userInfo.id + "&type=1&shopId=" + shareClickData.value.shop.id + "source=2",
    title: "您的好友给你推荐了（" + shareClickData.value.shop.name + "），预计花费 ￥" + takeMoney.value + "元",
    summary: "您的好友给你推荐了（" + shareClickData.value.shop.name + "），预计花费 ￥" + takeMoney.value + "元",
    imageUrl: shareClickData.value.shop.logo || BaseImgUrl + "/share/share_bg.png",
    success: function (res) {
      console.log("success:" + JSON.stringify(res));
    },
    fail: function (err) {
      console.log("fail:" + JSON.stringify(err));
    }
  });
}
// H5分享
const h5Share = (res) => {
  uni.navigateTo({
    url: '/pages_shopdetail/shopdetail?id=' + res.shop.id + '&activeIndex=0' + "&wxShareTip=true"
  })
}
// 显示更多按钮内容
const activeIndex = ref()
const setMore = (index) => {
  if (activeIndex.value === index){
    activeIndex.value = '-1'
  }else{
    activeIndex.value = index
  }
  emits('setMore', activeIndex.value)
  // console.log("activeIndex===",activeIndex.value, index)
}
// 查看详情事件
const checkDetailFun = (data) => {
  showOrderDetail.value = true
  console.log('订单id', data.id)

  getOrderProcess(data.id, data.order_type)
}
// 删除已取消订单
const delOrderFun = async (data) => {
  uni.showModal( {
    title: '提示',
    content: '您是否确认删除此订单?',
    cancelText: '取消',
    confirmText: '确定',
    success: async function (res) {
      if (res.confirm) {
        let res = await deleteOrderAPI(data.id)
        if (res.code === 200){
          uni.showToast({
            title: '删除成功',
            icon: 'none',
            duration: 2000
          })
          setTimeout(() => {
            uni.reLaunch( {
              url: '/pages/order/order'
            })
          }, 2000)
        } else {
          uni.showToast({
            title: res.message,
            icon: 'none'
          })
        }
      } else if (res.cancel) {
        console.log('用户点击取消')
      }
    }
  })
}
// 是否显示订单详情弹窗
const showOrderDetail = ref(false)
// 获取订单进程数据
const orderProcessData = ref([])
const getOrderProcess = async (id, type) => {
  let res =  await getOrderProcessAPI(id, type)
  console.log('订单进程', res)
  orderProcessData.value = res.result
}
// 跳转平台复制订单号
const orderNoCopy = async (type) => {
  await toMiniAppOrderPage(type)
}
// 去领取红包
const mtRedData = ref() //美团
const elmRedData = ref() //饿了么
const jdRedData = ref() //京东
const handleGetRedPack = async (type) => {
  mtRedData.value = commonInfoStore.reward ? commonInfoStore.reward.order[0] : []
  elmRedData.value = commonInfoStore.reward ? commonInfoStore.reward.order[1] : []
  jdRedData.value = commonInfoStore.reward ? commonInfoStore.reward.order[2] : []
  console.log('店铺平台=', mtRedData.value)
  //await toMiniAppRedPage(shop.value.type === 1 ? mtRedData.value : elmRedData.value )
  await toMiniAppRedPage(type === 3 ? jdRedData.value : type === 2 ? elmRedData.value : mtRedData.value)
}
// 修改订单号
const editOrderNo = (data) => {
  console.log("修改订单号===", data.user_pay_order_no)
  // 关闭修改弹窗
  isShowEditOrder.value = false
  if (data.user_pay_order_no == orderItemData.value.submit_order_no){
    uni.showToast({
      title: '新输入的订单号不能与原订单号相同',
      icon: 'none'
      , duration: 2000
    })
  } else {
    handleSaveUserPayOrderNo(data)
  }
  // orderItemData.value.user_pay_order_no = data.submit_order_no

}
// 复制订单号
const copy_no = (order_no) => {
  uni.setClipboardData({
    data: order_no, // e是你要保存的内容
    success: function () {
      uni.showToast({
        title: '复制成功',
        icon: 'none'
      })
    }
  });
}
// 修改订单号弹窗
const isShowEditOrder = ref( false)
</script>

<template>
  <view class="listOrder">
    <!-- top -->
    <view class="listTop">
      <view class="listLeft">
        <view class="order_title u-flex">
          <view class="shop_title u-flex" @click="copy_no(props.item.order_num)">
            <text class="text-Omit">订单号：</text>
            <text class="text-Omit">{{ props.item.order_num }}</text>
            <image :src="BaseImgUrl + '/order/order_no_icon.png'" style="margin-left: 10rpx"></image>
          </view>
        </view>

        <!--<view>
          <view class="shop_type" v-if="item.shop.type === 1">美团</view>
          <view class="elemtag" v-if="item.shop.type === 2">饿了么</view>
          <text class="shop_type3" v-if="item.shop.type === 3">京东</text>
        </view>
        <view style="width: 10rpx"></view>
        <view class="listTitile" style="flex:1;">
          <text>{{ item.shop_name }}</text>
        </view>-->
      </view>
      <view class="listRight">
        <!-- 点餐并且保存了订单号时显示上传凭证的倒计时 -->

        <text v-if="props.item.status === 0 && props.item.is_cancel === 0 && props.item.check_status === 0">已报名，待下单</text>
        <text v-if="props.item.status === 0 && props.item.is_cancel === 0 && props.item.check_status > 0 && props.item.check_status != 2">已下单，待上传</text>
        <text v-if="props.item.status === 0 && props.item.is_cancel === 0 && props.item.check_status === 2">已下单，待提交</text>
        <!--<text v-if="props.item.status === 0 && props.item.now_time > props.item.end_time">已失效</text>-->
        <text v-if="props.item.status === 1 && props.item.is_cancel === 0 && props.item.check_status >= 0" style="color:#FF7900;">正在审核中</text>
        <!--<text v-if="props.item.status === 4 && props.item.is_cancel === 0">等待商家付款</text>-->
        <text v-if="props.item.status === 4 && props.item.is_cancel === 0">已审核，<text style="color:#FF7900;">待返款</text></text>
        <text v-if="props.item.status === 2 && props.item.is_cancel === 0">驳回可提交</text>
        <text v-if="props.item.status === 5 && props.item.is_cancel === 0">已完成</text>
        <text v-if="props.item.is_cancel === 1 && props.item.status === 2 && props.item.check_status === 3">驳回超时已过期</text>
        <text v-if="props.item.status === 0 && props.item.is_cancel === 1 && props.item.check_status >= 0">过期或已取消</text>
        <!--<text v-if="props.item.is_cancel === 1 && (findcountdown(props.item) - new Date())<0">过期或已取消2</text>-->
        <text v-if="props.item.status === 3 && props.item.is_cancel === 0">驳回不可提交</text>
      </view>
    </view>
    <!--倒计时-->
    <view class="count_down">
      <!-- 抢单未点餐时的倒计时 check_status=0 -->
      <view v-if="props.item.status === 0 && props.item.is_cancel === 0 && props.item.check_status === 0" class="count_down_content">
        <text style="padding-right: 10rpx;">请在</text>
        <lszbg-count-down
            :time="findcountdown(props.item)"
            :format="format"
            :isHms="false"
            :isTimeColor="true"
            :is-color="true"
            :timeColor="{color: '#FF7900',padding: '0 4rpx'}"
            :timeStyle="{background: '#FF7900',color: '#FFFFFF', fontSize: '26rpx', padding: '4rpx 6rpx', borderRadius: '10rpx'}" >
        </lszbg-count-down>
        <text style="padding-left: 10rpx;">内点外卖并提交外卖订单号</text>
      </view>
      <!-- 提交订单号未上传凭证的倒计时 check_status=3-->
      <view v-if="props.item.status === 0 && props.item.is_cancel === 0 && props.item.check_status > 0" class="count_down_content">
        <text style="padding-right: 10rpx;">请在</text>
        <lszbg-count-down
            :time="findcountdown(props.item)"
            :format="format"
            :isHms="false"
            :isTimeColor="true"
            :is-color="true"
            :timeColor="{color: '#FF7900',padding: '0 4rpx'}"
            :timeStyle="{background: '#FF7900',color: '#FFFFFF', fontSize: '26rpx', padding: '4rpx 6rpx', borderRadius: '10rpx'}" >
        </lszbg-count-down>
        <text v-if="props.item.check_status === 2" style="padding-left: 10rpx;">内上提交审核，过期将无法获得返现!</text>
        <text v-else style="padding-left: 10rpx;">内上传凭证，过期将无法获得返现!</text>
      </view>
    </view>
    <view class="order_line" style="padding: 0 20rpx;"><u-line color="#EAEAEA" hairline></u-line></view>
    <!--content-->
    <view class="order_content">
      <view class="order_content_header">
        <image v-if="props.item.shop.logo" :src="props.item.shop.logo" style="width: 176rpx;height: 176rpx;object-fit: cover;"></image>
        <image v-if="!props.item.shop.logo" mode="widthFix" style="width: 100%;"
               src="https://img.alicdn.com/imgextra/i2/3829152210/O1CN01ZEkb1x1SCE3sKyaNT_!!3829152210.png"></image>
      </view>
      <view class="order_content_right">
        <view class="order_shop_title ellipsis-one-line">{{ props.item.shop.name }}</view>
        <view class="order_shop_refund">
          <view class="order_shop_refund_content">
            <view class="refund_return">{{ props.item.is_first_order === 1 ? '新人全额返' : '返' }}</view>
            <view class="refund_return_cashback">
              {{ '满' + twoFixed(props.item.activity.minimum_amount) + '返'}}
              {{props.item.is_first_order === 1 ? twoFixed(props.item.activity.minimum_amount) : twoFixed(props.item.activity.member_rebate_amount)}}
            </view>
          </view>
          <!--<view v-if="props.item.activity?.is_comment === 1" class="order_shop_item order_shop_evaluate" style="">星级品鉴</view>-->
          <view v-if="props.item.activity?.is_comment === 2" class="order_shop_item order_shop_noEvaluate" style="">无需品鉴</view>
          <view v-if="props.item.activity?.comment_type === 3" class="order_shop_item order_shop_evaluate" style="">图文品鉴</view>
          <view v-if="props.item.activity?.comment_type === 4" class="order_shop_item order_shop_evaluate" style="">文字品鉴</view>
        </view>
        <view class="order_shop_platform">
          <text>活动平台：</text>
          <view v-if="props.item.shop.type == 1" class="yysj_text_platform"><image :src="BaseImgUrl + '/home/meituan_icon.png'" mode="widthFix" style="width: 32rpx;height: 32rpx;"></image>美团</view>
          <view v-if="props.item.shop.type == 2" class="yysj_text_platform"><image :src="BaseImgUrl + '/home/elm_icon.png'" mode="widthFix" style="width: 32rpx;height: 32rpx;"></image>饿了么</view>
          <view v-if="props.item.shop.type == 3" class="yysj_text_platform"><image :src="BaseImgUrl + '/home/jd_icon.png'" mode="widthFix" style="width: 32rpx;height: 32rpx;"></image>京东</view>
        </view>
        <view class="order_shop_time">
          <text>报名时间：</text>
          <view class="yysj_text_time">{{ props.item.create_time }}</view>
        </view>
      </view>
    </view>
    <!--减免规则-->
    <!--<view class="pingjia_box">
      <view class="pingjia">
        <view>减免规则:</view>
        <view>
          <text class="choice_right">
            <text v-if="props.item['min_charge'] != 0.00">超级会员满
              <text style="color:#F97632">{{ props.item['min_charge'] }}</text>
              减
              <text style="color:#F97632">{{ props.item['member_rebate_amount'] }}</text>
            </text>
            <text v-else>
              超级会员最高减免
              <text style="color:#F97632">{{ props.item['member_rebate_amount'] }}</text>
            </text>
          </text>
          <text class="choice_right">
            <text v-if="props.item['min_charge'] != 0.00">
              非会员满
              <text style="color:#F97632">{{ props.item['min_charge'] }}</text>
              减
              <text style="color:#F97632">{{ props.item['rebate_amount'] }}</text>
            </text>
            <text v-else>
              非会员最高减免
              <text style="color:#F97632">{{ props.item['rebate_amount'] }}</text>
            </text>
          </text>
        </view>
      </view>
      <view class="pingjia">
        <view>商家留言:</view>
        <view>{{ props.item.shop_activity_ask }}</view>
      </view>
      <view v-if="props.item.money" class="pingjia" style="display: flex">
        <view>使用红包额外返：</view>
        <view>
          <text class="choice_right">
            <text style="color:#F97632">{{ props.item.money }}</text>
            元
          </text>
        </view>
      </view>
    </view>-->
    <view class="save_order_no">
      <!--订单号审核通过的显示订单号 -->
      <view v-if="props.item.check_status > 0 && props.item.check_status < 3 && props.item.is_cancel===0 && props.item.status === 0" style="border: 1rpx solid #FFB878;border-radius: 8rpx;overflow: hidden">
        <u-input v-model="props.item.user_pay_order_no" :disabled="true"
                 :customStyle="{fontSize: '26rpx',background:'#FFFBEE',padding:'8rpx 10rpx ',color: '#333333',border:'none'}"
                 placeholder="请输入正确的订单号"
                 type="text">
          <template #prefix>
            <view style="display: flex;align-items: center;">
              <!--<image :src="BaseImgUrl + '/order_btn.png'" style="width: 38rpx;height: 38rpx"></image>-->
              <view style="color: black;font-size: 26rpx;margin-left: 6rpx;font-weight: bold;">
                订单号 :
              </view>
            </view>
          </template>
        </u-input>
      </view>
      <view v-if="props.item.check_status === 0 && props.item.is_cancel===0 && props.item.status === 0" style="border: 1rpx solid #FFB878;border-radius: 8rpx;overflow: hidden">
        <u-input v-model="props.item.user_pay_order_no"
                 :customStyle="{fontSize: '26rpx',background:'#FFFBEE',padding:'8rpx 10rpx ',color: '#333333',border:'none'}"
                 placeholder="请输入正确的订单号"
                 type="text">
          <template #prefix>
            <view style="display: flex;align-items: center;">
              <!--<image :src="BaseImgUrl + '/order_btn.png'" style="width: 38rpx;height: 38rpx"></image>-->
              <view style="color: black;font-size: 26rpx;margin-left: 6rpx;font-weight: bold;">
                订单号 :
              </view>
            </view>
          </template>
          <template #suffix>
            <view @click="orderNoCopy(props.item.shop.type)" class="choice_right">去复制</view>
          </template>
        </u-input>
      </view>
      <view v-if="props.item.check_status >= 3 && props.item.is_cancel===0 && props.item.status === 0" style="border: 1rpx solid #FFB878;border-radius: 8rpx;overflow: hidden">
        <u-input v-model="props.item.submit_order_no"
                 :customStyle="{fontSize: '26rpx',background:'#FFFBEE',padding:'8rpx 10rpx ',color: '#333333',border:'none'}"
                 placeholder="请输入正确的订单号"
                 type="text">
          <template #prefix>
            <view style="display: flex;align-items: center;">
              <!--<image :src="BaseImgUrl + '/order_btn.png'" style="width: 38rpx;height: 38rpx"></image>-->
              <view style="color: black;font-size: 26rpx;margin-left: 6rpx;font-weight: bold;">
                订单号 :
              </view>
            </view>
          </template>
          <template #suffix>
            <view @click="isShowEditOrder = true" class="edit_right"><u-icon name="edit-pen" size="20" color="#888888"></u-icon>修改</view>
          </template>
        </u-input>
      </view>
    </view>
    <view v-if="props.item.status === 2 || props.item.status === 3" class="pingjia_box">
      <view class="pingjia bohui_bg">
        <view>驳回原因 : {{ props.item.check_refuse_reason }}</view>
      </view>
    </view>
    <!-- bottom props.item.isSelected === 1-->
    <view class="bottom">
      <view class="bottom_left">
        <view @click.stop="setMore(orderIndex)" class="bottom_left_btn">更多</view>
        <view v-if="activeIndex === orderIndex" class="bottom_left_content">
          <!--<view class="bottom_left_sjx"><view class="sjx_content"></view></view>-->
          <view class="triangle_box">
            <image :src="BaseImgUrl + '/order/order_sjx.png'" class="order_triangle_img" style="width: 160rpx;height: 23rpx;"></image>
            <view class="btn_details">
              <view @click="checkDetailFun(props.item)" class="btn_check">查看详情</view>
              <view v-if="props.item.is_cancel === 1 || props.item.status === 3 || props.item.status === 5" @click="delOrderFun(props.item)" class="btn_del">删除订单</view>
            </view>
          </view>
        </view>
      </view>
      <view class="bottom_right">
        <!--<view @click="H5Click(props.item)" class="btn_item">
          H5跳转
        </view>-->
        <view v-if="props.item.is_resume === 1 && props.item.is_cancel === 1" @click="handleResumeOrder(props.item,orderIndex)"  class="btn_item">
          恢复订单
        </view>
        <view v-if="props.item.status === 1 && props.item.is_cancel === 0 && props.item.check_status >= 0" @tap="oneKeyCuiShenFun(props.item)"  class="btn_item">
          一键催审
        </view>
        <view v-if="props.item.status !== 0 || props.item.is_cancel === 1" @click="handleTwoOrder(props.item, props.item.activity.id)"  class="btn_item">
          再抢一单
        </view>
        <view v-if="props.item.status === 2 && props.item.is_cancel === 0 && props.item.check_status>2" @click="handleUpload(props.item.id, props.source)"  class="btn_item">
          修改上传
        </view>
        <view v-if="props.item.status === 0 && props.item.is_cancel === 0" :data-id="props.item.id"
              @tap="cancelOrder(props.item)"  class="btn_item cancel_order">取消报名
        </view>
        <!--<view v-if="props.item.status === 3 && props.item.is_cancel === 0" :data-id="props.item.id"
              @tap="checkDetailFun(props.item)"  class="btn_item cancel_order">查看详情
        </view>-->
        <view v-if="props.item.check_status >= 1 && props.item.check_status <= 4 && props.item.check_status !==2 && props.item.status === 0 && props.item.is_cancel===0 && props.item.is_resume===0"
            @click="handleUpload(props.item.id, props.source)"  class="btn_item">
          上传凭证
        </view>
        <view v-if="props.item.status <= 2 && props.item.status !== 1 && props.item.is_cancel===0 && props.item.check_status === 2"
              @click="handleUploadOrderNo(props.item.id, props.source)"  class="btn_item">
          提交审核
        </view>
        <!--#ifdef APP-PLUS-->
        <!--订单检测 -->
        <view @tap="gotoMeituanPage(props.item)" v-if="props.item.status === 0 && props.item.is_cancel === 0 && props.item.check_status > 0" class="btn_item">
          订单检测
        </view>
        <!--#endif-->
        <view v-if="props.item.status === 3 && props.item.is_cancel === 0" @click="reasonForrejection(props.item)"  class="btn_item">
          查看原因
        </view>
        <view style="color: #FF7900;width: 160rpx;height: 60rpx;background: #FFFFFF;border: 2rpx solid #FF7900;"
              v-if="props.item.status === 0 && props.item.is_cancel === 0 && props.item.check_status === 0" :data-props.item="props.item" @tap="goShop(props.item)"  class="btn_item">
          进店下单
        </view>
        <view v-if="props.item.check_status < 1 && props.item.is_cancel===0" @tap="handleSaveUserPayOrderNo(props.item)"  class="btn_item">
          保存单号
        </view>
        <!--分享按钮 v-if="props.item.status === 5 && props.item.is_cancel === 0" -->
        <view v-if="props.item.status === 5 && props.item.is_cancel === 0" class="top_share_box" @click="share(props.item)" >
          <view class="tishi_box">
            <text class="tishi_text">分享得奖励</text>
            <image :src="BaseImgUrl + '/order/order_tip_bg01.png'" mode="widthFix" style="width: 140rpx;height: 48rpx;"></image>
          </view>
          <view style="height: 36rpx"></view>
          <view class="share_btn">分享</view>
          <!--<u-icon class="share_icon" ref="shareIcon" :name="currentIcon" size="26" color="#0CBB2F" bg-color="#0CBB2F"></u-icon>-->
        </view>
      </view>
    </view>
    <!--报名后领取红包更优惠-->
    <view v-if="props.item.status === 0 && props.item.is_cancel === 0 && !newUser" class="signup_red_box">
      <view class="signup_red_box_content">
        <view class="signup_red_left">
          <image :src="BaseImgUrl + '/order/red_icon01.png'" style="width: 36rpx;height: 36rpx;"></image>
          <view class="signup_red_left_text">领红包下单更优惠多省<text style="color: #FF7900;">3-9元并免审</text></view>
        </view>
        <view @click="handleGetRedPack(props.item.shop.type)" class="signup_red_right" style="position: relative;">
          <view class="signup_red_right_btn">去领取</view>
          <!-- #ifdef H5 -->
          <wx-open-launch-weapp id="launch-btn"
                                :username="props.item.shop.type === 1 ? commonInfoStore.reward.order[0].original_id : props.item.shop.type === 2 ? commonInfoStore.reward.order[1].original_id : commonInfoStore.reward.order[2].original_id"
                                :path="props.item.shop.type === 1 ? commonInfoStore.reward.order[0]?.path : props.item.shop.type === 2 ? commonInfoStore.reward.order[1]?.path : commonInfoStore.reward.order[3]?.path"
                                style="position: absolute;z-index: 2;left: 0;width: 100%;height:100%;opacity: 0.01;background-color: #ff531a">
            <component :is="'script'" type='text/wxtag-template' style="display: block;">
              <div style="position: absolute;top: 0; left: 0; width: 100%;height: 100% ; opacity: 0"></div>
            </component>
          </wx-open-launch-weapp>
          <!-- #endif -->
        </view>
      </view>
    </view>
    <!--新用户首单补贴-->
    <view v-if="props.item.is_first_order === 1 && newUser == '新用户' && props.item.is_cancel === 0" class="shop_first_tip">
      <view class="shop_process_tip_content">
        <view class="shop_first_img">
          <image :src="BaseImgUrl + '/order/red_icon01.png'" style="width: 32rpx;height: 36rpx;padding-right: 10rpx;"></image>
          <image :src="BaseImgUrl + '/order/free_icon.png'" style="width: 100rpx;height: 34rpx;padding-right: 10rpx;"></image>
        </view>
        <view class="shop_first_text_box">
          <text class="tips_text_title">首单实付满<text style="color: #F83123;padding: 0 4rpx;">{{ twoFixed(props.item.activity.minimum_amount) }}</text>返<text style="color: #F83123;padding: 0 4rpx;">{{ userInfo.is_member === 0 ? twoFixed(props.item.activity.rebate_amount) : twoFixed(props.item.activity.member_rebate_amount)}}</text>后，再得</text>
          <text v-if="userInfo.is_member === 0">
            <text v-if="twoFixed(props.item.activity.minimum_amount) - twoFixed(props.item.activity.rebate_amount) > 3"><text style="color: #F83123;padding: 0 4rpx;">3元</text>奖励加<text style="color: #F83123;padding: 0 4rpx;">{{ twoFixed(props.item.activity.minimum_amount) - twoFixed(props.item.activity.rebate_amount) -3 }}</text>元无门槛红包</text>
            <text v-else><text style="color: #F83123;padding: 0 4rpx;">{{ twoFixed(props.item.activity.minimum_amount) - twoFixed(props.item.activity.rebate_amount) }}元</text>奖励</text>
          </text>
          <text v-if="userInfo.is_member === 1">
            <text v-if="twoFixed(props.item.activity.minimum_amount) - twoFixed(props.item.activity.member_rebate_amount) > 3"><text style="color: #F83123;padding: 0 4rpx;">3元</text>奖励加<text style="color: #F83123;padding: 0 4rpx;">{{ twoFixed(props.item.activity.minimum_amount) - twoFixed(props.item.activity.member_rebate_amount) -3 }}元</text>无门槛红包</text>
            <text v-else><text style="color: #F83123;padding: 0 4rpx;">{{ twoFixed(props.item.activity.minimum_amount) - twoFixed(props.item.activity.member_rebate_amount) }}元</text>奖励</text>
          </text>
        </view>
      </view>
    </view>

    <!--订单按钮分享-->
    <up-popup :show="showShare" mode="bottom" @close="popupClose" :closeable="true" round="10" :safeAreaInsetBottom="false">
      <view class="share_box">
        <view class="share_top">
          <view class="share_top_bg"><image :src="BaseImgUrl + '/share/share_top_bg.png'" mode="widthFix" style="width: 100%;"></image></view>
          <view class="share_top_warp">
            <view class="share_top_warp_title">分享店铺 赚现金奖励</view>
            <view class="share_top_warp_subtitle">每邀请 <text style="color: #FF3230">1</text> 位新用户下单，你最少可获得 <text style="color: #FF3230">3元</text> 现金奖励</view>
            <view class="share_top_warp_content">
              <view class="share_top_warp_content_item">
                <view style="position: relative;margin-top: 30rpx;color:#FA642B;min-height: 268rpx">
                  <image :src="BaseImgUrl + '/share/yqjl@2x.png'"
                         style="width: 650rpx;height: 268rpx;position: absolute"></image>
                  <view class="u-flex" style="position: relative;justify-content: flex-start;align-items: flex-start">
                    <view style="text-align: center;flex: 1;margin-top: 20rpx">
                      <view style="font-size: 28rpx;margin-top: 20rpx;font-weight: bold;">
                        ￥
                        <text style="font-size: 48rpx">3</text>
                      </view>
                      <view style="font-size: 26rpx;margin-top: 10rpx;text-align: center;margin-left: 10rpx">
                        邀请1人
                      </view>
                    </view>
                    <view style="text-align: center;flex: 1;margin-top: 20rpx">
                      <view style="font-size: 28rpx;margin-top: 20rpx;font-weight: bold;">
                        ￥
                        <text style="font-size: 48rpx">5</text>
                      </view>
                      <view style="font-size: 26rpx;margin-top: 10rpx;text-align: center;margin-left: 10rpx">
                        邀请2-5人
                      </view>
                    </view>
                    <view style="text-align: center;flex: 1;margin-top: 20rpx">
                      <view style="font-size: 28rpx;margin-top: 20rpx;font-weight: bold;">
                        ￥
                        <text style="font-size: 48rpx">8</text>
                      </view>
                      <view style="font-size: 26rpx;margin-top: 10rpx;text-align: center;margin-left: 10rpx">
                        邀请≥6人
                      </view>
                    </view>
                  </view>
                </view>
              </view>
            </view>
          </view>
        </view>
        <view class="wechat_box">
          <!-- #ifdef MP -->
          <view class="small_box" >
            <button class="complete1" open-type="share"
              :data-share="{
                'shopName': props.item.shop.name,
                'shopId': props.item.shop.id,
                'imageUrl': props.item.shop.logo,
                'activity': props.item.activity,
              }"
            >
              <view class="icon">
                <image :src="BaseImgUrl + '/group/wechat_icon.png'"></image>
              </view>
              <view class="name">微信好友</view>
            </button>
          </view>
          <view class="small_box" @click="ShareTimeLine(props.item)">
              <view class="icon">
                <image :src="BaseImgUrl + '/group/pyq_icon.png'"></image>
              </view>
              <view class="name">朋友圈</view>
          </view>
          <view class="small_box">
            <button class="complete1" open-type="share"
              :data-share="{
                'shopName': props.item.shop.name,
                'shopId': props.item.shop.id,
                'imageUrl': props.item.shop.logo,
                'activity': props.item.activity,
              }"
            >
              <view class="icon">
                <image :src="BaseImgUrl + '/group/share_icon.png'"></image>
              </view>
              <view class="name">分享链接</view>
            </button>
          </view>
          <!-- #endif -->
          <!-- #ifdef APP-PLUS -->
          <view class="small_box" @click="handleShareWechat(props.item)">
            <view class="icon">
              <image :src="BaseImgUrl + '/group/wechat_icon.png'"></image>
            </view>
            <view class="name">微信好友</view>
          </view>
          <view class="small_box" @click="handleShareTimeline(props.item)">
            <view class="icon">
              <image :src="BaseImgUrl + '/group/pyq_icon.png'"></image>
            </view>
            <view class="name">朋友圈</view>
          </view>
          <!--<view class="small_box" @click="handleSavePhoto()">
            <view class="icon">
              <image :src="BaseImgUrl + '/group/upload_icon.png'"></image>
            </view>
            <view class="name">保存图片</view>
          </view>-->
          <view class="small_box" @click="handleShareWechat(props.item)">
            <view class="icon">
              <image :src="BaseImgUrl + '/group/share_icon.png'"></image>
            </view>
            <view class="name">分享链接</view>
          </view>
          <!-- #endif -->
          <!-- #ifdef H5 -->
          <view class="small_box" @click="h5Share(props.item)">
            <view class="icon">
              <image :src="BaseImgUrl + '/group/wechat_icon.png'"></image>
            </view>
            <view class="name">微信好友</view>
          </view>
          <view class="small_box" @click="h5Share(props.item)">
            <view class="icon">
              <image :src="BaseImgUrl + '/group/pyq_icon.png'"></image>
            </view>
            <view class="name">朋友圈</view>
          </view>
          <view class="small_box" @click="h5Share(props.item)">
            <view class="icon">
              <image :src="BaseImgUrl + '/group/share_icon.png'"></image>
            </view>
            <view class="name">分享链接</view>
          </view>
          <!-- #endif -->
        </view>
      </view>
      <!--<view style="padding-bottom: env(safe-area-inset-bottom);"></view>-->
      <!--#ifdef H5-->
      <!--<view style="padding-bottom: env(safe-area-inset-bottom);"></view>-->
      <!--#endif-->
    </up-popup>
    <!--查看订单详情-->
    <u-popup :show="showOrderDetail" mode="bottom" round="20" bgColor="#f4f4f4"
      :safeAreaInsetBottom="false"
      :closeable="true"
      @close="showOrderDetail = false"
      :customStyle="{maxHeight: '1200rpx'}">
      <view class="order_detail">
        <view class="order_detail_box">
          <view class="order_detail_box_title">订单详情</view>
          <!--店铺名称-->
          <view class="order_detail_shop">
            <view class="listTop">
              <view class="listLeft">
                <view class="order_title u-flex">
                  <view class="shop_title u-flex" @click="copy_no(props.item.order_num)">
                    <text class="text-Omit">订单号：</text>
                    <text class="text-Omit">{{ props.item.order_num }}</text>
                    <image :src="BaseImgUrl + '/order/order_no_icon.png'" style="margin-left: 10rpx"></image>
                  </view>
                </view>
              </view>
              <view class="listRight">
                <!-- 点餐并且保存了订单号时显示上传凭证的倒计时 -->

                <text v-if="props.item.status === 0 && props.item.is_cancel === 0 && props.item.check_status === 0">已报名，待下单</text>
                <text v-if="props.item.status === 0 && props.item.is_cancel === 0 && props.item.check_status > 0">已下单，待上传</text>
                <!--<text v-if="props.item.status === 0 && props.item.now_time > props.item.end_time">已失效</text>-->
                <text v-if="props.item.status === 1 && props.item.is_cancel === 0 && props.item.check_status >= 0" style="color:#FF7900;">正在审核中</text>
                <!--<text v-if="props.item.status === 4 && props.item.is_cancel === 0">等待商家付款</text>-->
                <text v-if="props.item.status === 4 && props.item.is_cancel === 0">已审核，<text style="color:#FF7900;">待返款</text></text>
                <text v-if="props.item.status === 2 && props.item.is_cancel === 0">驳回可提交</text>
                <text v-if="props.item.status === 5 && props.item.is_cancel === 0">已完成</text>
                <text v-if="props.item.is_cancel === 1 && props.item.status === 2">驳回超时已过期</text>
                <text v-if="props.item.status === 0 && props.item.is_cancel === 1 && props.item.check_status >= 0">过期或已取消</text>
                <!--<text v-if="props.item.is_cancel === 1 && (new Date(props.item.end_time)-new Date())<0">过期或已取消</text>-->
                <text v-if="props.item.status === 3 && props.item.is_cancel === 0">驳回不可提交</text>
              </view>
            </view>
            <view class="order_line"><u-line color="#EAEAEA" hairline></u-line></view>
            <view class="order_content" style="padding-bottom: 0">
              <view class="order_content_header">
                <image v-if="props.item.shop.logo" :src="props.item.shop.logo" mode="widthFix" style="width: 100%;"></image>
                <image v-if="!props.item.shop.logo" mode="widthFix" style="width: 100%;"
                       src="https://img.alicdn.com/imgextra/i2/3829152210/O1CN01ZEkb1x1SCE3sKyaNT_!!3829152210.png"></image>
              </view>
              <view class="order_content_right">
                <view class="order_shop_title ellipsis-one-line">{{ props.item.shop.name }}</view>
                <view class="order_shop_refund">
                  <view class="order_shop_refund_content">
                    <view class="refund_return">{{ props.item.is_first_order === 1 ? '新人全额返' : '返' }}</view>
                    <view class="refund_return_cashback">
                      {{ '满' + twoFixed(props.item.activity.minimum_amount) + '返'}}
                      {{props.item.is_first_order === 1 ? twoFixed(props.item.activity.minimum_amount) : twoFixed(props.item.activity.member_rebate_amount)}}
                    </view>
                  </view>
                  <!--<view v-if="props.item.activity?.is_comment === 1" class="order_shop_item order_shop_evaluate" style="">星级品鉴</view>-->
                  <view v-if="props.item.activity?.is_comment === 2" class="order_shop_item order_shop_noEvaluate" style="">无需品鉴</view>
                  <view v-if="props.item.activity?.comment_type === 3" class="order_shop_item order_shop_evaluate" style="">图文品鉴</view>
                  <view v-if="props.item.activity?.comment_type === 4" class="order_shop_item order_shop_evaluate" style="">文字品鉴</view>
                </view>
                <view class="order_shop_platform">
                  <text>活动平台：</text>
                  <view v-if="props.item.shop.type == 1" class="yysj_text_platform"><image :src="BaseImgUrl + '/home/meituan_icon.png'" mode="widthFix" style="width: 32rpx;height: 32rpx;"></image>美团</view>
                  <view v-if="props.item.shop.type == 2" class="yysj_text_platform"><image :src="BaseImgUrl + '/home/elm_icon.png'" mode="widthFix" style="width: 32rpx;height: 32rpx;"></image>饿了么</view>
                  <view v-if="props.item.shop.type == 3" class="yysj_text_platform"><image :src="BaseImgUrl + '/home/jd_icon.png'" mode="widthFix" style="width: 32rpx;height: 32rpx;"></image>京东</view>
                </view>
                <view class="order_shop_time">
                  <text>报名时间：</text>
                  <view class="yysj_text_time">{{ props.item.create_time }}</view>
                </view>
              </view>
            </view>
          </view>
          <!--订单进程步骤条-->
          <view class="order_detail_steps">
            <scroll-view scroll-y="true" style="max-height: 680rpx; white-space: nowrap;">
              <view class="steps_content">
                <view v-for="(itemProcess, index) in orderProcessData" :key="index" class="steps_item" :class="index === 0 ? 'steps_zero' : ''">
                  <view class="steps_time">
                    <view v-if="index === 0" class="steps_round_icon"><image :src="BaseImgUrl + '/order/order_process_icon.png'" mode="widthFix" style="width: 100%;"></image></view>
                    <view v-else class="steps_round"></view>
                    <view class="steps_time_text">{{ itemProcess.create_time }}</view>
                  </view>
                  <view class="steps_title">{{ itemProcess.status_text }}</view>
                  <view v-if="itemProcess.reason" class="steps_desc">{{ itemProcess.reason }}</view>
                </view>
              </view>
              <!--#ifdef H5-->
              <view style="height: 120rpx;"></view>
              <!--#endif-->
            </scroll-view>
          </view>
        </view>
      </view>
    </u-popup>
    <!--修改订单号弹窗-->
    <u-popup :show="isShowEditOrder" mode="bottom" round="16" :closeable="true" @close="isShowEditOrder = false" :safeAreaInsetBottom="false" :customStyle="{width: '100%'}">
      <view class="edit_order_box">
        <view class="edit_order_title">修改订单号</view>
        <view class="edit_order_content">
          <view class="edit_order_content_inp">
            <u-input v-model="props.item.user_pay_order_no"
                     :customStyle="{fontSize: '26rpx',background:'#FCFCFC',padding:'8rpx 10rpx ',color: '#333333',border:'none'}"
                     placeholder="请输入正确的订单号"
                     type="text">
              <template #prefix>
                <view style="display: flex;align-items: center;">
                  <!--<image :src="BaseImgUrl + '/order_btn.png'" style="width: 38rpx;height: 38rpx"></image>-->
                  <view style="color: black;font-size: 26rpx;margin-left: 6rpx;font-weight: bold;">
                    订单号 :
                  </view>
                </view>
              </template>
              <template #suffix>
                <view @click="orderNoCopy(props.item.shop.type)" class="choice_right">去复制</view>
              </template>
            </u-input>
          </view>
        </view>
        <view @tap="editOrderNo(props.item)" class="edit_order_btn">
          <view class="edit_order_btn_text">确认修改</view>
        </view>
      </view>
    </u-popup>
  </view>
</template>
<style lang="scss">
:deep(.u-count-down__text) {
  font-size: 26rpx;
  color: #F97632 !important;
}
</style>
<style lang="scss">

.tabs {
  padding: 0 10rpx;
  background-color: #FFFFFF;
  box-shadow: #F6F6F6 0 2rpx 8rpx 2rpx;
}

.notice_box {
  background-color: #FFFBEE;
  display: flex;
  box-sizing: border-box;
  padding: 10rpx 30rpx;
  margin-bottom: 20rpx;

  image {
    width: 52rpx;
    height: 52rpx;
    margin-right: 10rpx;
  }

  .desc_text {
    flex: 1;
    display: inline-block;
    font-size: 25rpx;
    color: #FC754A;
    line-height: 45rpx;
  }
}

.orderTotal {
  //height: auto;
}


.listLeft {
  display: flex;
  align-items: center;
  flex: 1;
  .order_title {
    align-items: center;
    justify-content: space-between;

    .shop_title {
      align-items: center;

      image {
        width: 32rpx;
        height: 32rpx;
        margin-right: 6rpx;
      }

      text {
        color: #999999;
        font-size: 24rpx;
        -webkit-line-clamp: 1;
      }
    }

    .status {
      flex: 1;
      text-align: right;
      font-size: 24rpx;
      .color1 {
        color: #FF4E0D;
      }
      .color2 {
        color: #00AA3B;
      }
      .color3 {
        color: #999999;
      }
    }
  }
}

.shop_type {
  background-color: #FECC32;
  color: #333333;
  border-radius: 8rpx;
  font-size: 24rpx;
  text-align: center;
  padding: 2rpx 10rpx;
  margin-right: 10rpx;
  flex: 1;
}

.shop_type3 {
  background-color: #db2727;
  color: #FFFFFF;
  border-radius: 8rpx;
  font-size: 24rpx;
  text-align: center;
  padding: 0 6rpx;
  height: 36rpx;
  line-height: 36rpx;
}

.elemtag {
  background-color: #17aeff;
  color: #ffffff;
  border-radius: 8rpx;
  font-size: 24rpx;
  text-align: center;
  padding: 2rpx 10rpx;
  margin-right: 10rpx;
  flex: 1;
}

.listTitile {
  word-break: break-all;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.listTitile text {
  font-size: 30rpx;
  color: #111111;
  font-weight: bold;
}

.listTitile image {
  width: 11rpx;
  height: 22rpx;
}



.listTop {
  padding: 30rpx 20rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
  .listRight {
    float: right;
    font-size: 24rpx;
    color: #333333;
    .time_d {
      font-size: 26rpx;
      color: #FF3819;
      font-weight: bold;
    }
  }
}

.listOrder {
  position: relative;
  .mask_layer{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    background: rgba(0, 0, 0, 0.5);
  }
}
/* 倒计时css */
.count_down{
  padding: 0 20rpx;
  .count_down_content{
    padding-bottom: 20rpx;
    display: flex;
    align-items: center;
    font-size: 24rpx;
    color: #666666;

  }
}
/* content */
.order_content {
  height: 176rpx;
  padding: 20rpx;
  display: flex;
  .order_content_header {
    overflow: hidden;
    width: 176rpx;
    height: 176rpx;
    border-radius: 20rpx;

  }
  .order_content_right {
    flex: 1;
    padding-left: 10rpx;
    .order_shop_title{
      font-size: 28rpx;
      color: #333333;
      line-height: 40rpx;
      margin-bottom: 10rpx;
    }
    .order_shop_refund{
      display: flex;
      align-items: center;
      padding-bottom: 10rpx;
      .order_shop_refund_content{
        height: 36rpx;
        line-height: 36rpx;
        padding: 2rpx 2rpx 2rpx 10rpx;
        display: flex;
        align-items: center;
        border-radius: 8rpx;
        background: #fd7c22;
        .refund_return{
          color: #fff;
          font-size: 24rpx;
          padding-right: 10rpx;
        }
        .refund_return_cashback{
          padding: 0 10rpx;
          border-radius: 0 6rpx 6rpx 0;
          color: #fd7c22;
          font-size: 22rpx;
          text-align: center ;
          background: #FFFFFF;
        }
      }
      .order_shop_item{
        font-size: 24rpx;
        line-height: 34rpx;
      }
      .order_shop_evaluate{
        font-size: 22rpx;
        line-height: 36rpx;
        color: #FF4444;
        text-align: center;
        padding: 0rpx 10rpx;
        border: 2rpx solid #FF4444;
        background: #FFFFFF;
        border-radius: 8rpx 8rpx 8rpx 8rpx;
        margin-left: 10rpx;
      }
      .order_shop_noEvaluate{
        font-size: 22rpx;
        line-height: 36rpx;
        color: #2DB327;
        text-align: center;
        padding: 0 10rpx;
        background: #F5FFF5;
        border-radius: 8rpx 8rpx 8rpx 8rpx;
        border: 2rpx solid #74D87F;
        margin-left: 10rpx;
      }
    }
    .order_shop_platform{
      font-size: 24rpx;
      color: #888888;
      padding-bottom: 10rpx;
      display: flex;
      .yysj_text_platform{
        padding-left: 10rpx;
        display: flex;
      }
    }
    .order_shop_time{
      font-size: 24rpx;
      color: #888888;
      line-height: 34rpx;
      display: flex;
    }
  }
}

/* bottom */
.bottom {
  margin-top: 30rpx;
  margin-bottom: 20rpx;
  padding: 0 20rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
  .bottom_left{
    width: 160rpx;
    position: relative;
    z-index: 10;
    .bottom_left_btn{
      font-size: 26rpx;
      color: #999999;
      line-height: 28rpx;
      padding: 16rpx 20rpx;
    }
    .bottom_left_content{
      width: 100%;
      transition: height 0.3s ease; /* 平滑过渡效果 */
      position: absolute;
      left: 10rpx;
      top: 50rpx;
      z-index: 10;
      .triangle_box{
        position: relative;
      }
      .bottom_left_sjx{
        width:0;
        height:0;
        border-width:0 24rpx 24rpx;
        border-style:solid;
        border-color:transparent transparent #F0F0F0;/*透明 透明  灰*/
        border-radius: 50rpx;
        margin-left: 10rpx;
        position:relative;
        z-index: 10;
        .sjx_content{
          display:block;
          width:0;
          height:0;
          border-width:0 22rpx 22rpx;
          border-style:solid;
          border-color:transparent transparent #FFFFFF;/*透明 透明  黄*/
          border-radius: 50rpx;
          position:absolute;
          top:2rpx;
          left:-22rpx;
        }
      }
      .order_triangle_img{
        position: relative;
        z-index: 12;
      }
      .btn_details{
        position: absolute;
        top: 24rpx;
        left: 0;
        right: 0;
        z-index: 11;
        background: #FFFFFF;
        border-radius: 10rpx;
        border: 2rpx solid #F0F0F0;
        box-shadow: 0 4rpx 10rpx 0 rgba(0,0,0,0.1);
        .btn_del{
          height: 60rpx;
          line-height: 60rpx;
          font-size: 24rpx;
          color: #3D3D3D;
          background: #FFFFFF;

          border-radius: 16rpx;
          text-align: center;
        }
        .btn_check{
          height: 60rpx;
          line-height: 60rpx;
          font-size: 24rpx;
          color: #3D3D3D;
          background: #FFFFFF;
          // box-shadow: 0 4rpx 10rpx 0 rgba(0,0,0,0.1);
          border-radius: 16rpx;
          text-align: center;
        }
      }
    }
  }
  .bottom_right{
    width: calc(100% - 160rpx);
    text-align: right;
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
}
/* 报名后领取红包更优惠css */
.signup_red_box{
  height: 62rpx;
  padding: 30rpx 6rpx 0;
  .signup_red_box_content{
    height: 62rpx;
    line-height: 62rpx;
    background: linear-gradient( 270deg, #FFFFFF 0%, #FFF1F1 100%);
    border-radius: 0rpx 0rpx 16rpx 16rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .signup_red_left{
      padding-left: 10rpx;
      display: flex;
      align-items: center;
      .signup_red_left_text{
        padding-left: 10rpx;
        font-size: 22rpx;
        color: #3D3D3D;
      }
    }
    .signup_red_right{
      display: flex;
      align-items: center;
      padding-right: 20rpx;
      .signup_red_right_btn{
        width: 100rpx;
        height: 40rpx;
        line-height: 40rpx;
        color: #FF7900;
        font-size: 24rpx;
        text-align: center;
        border-radius: 8rpx;
        border: 2rpx solid #FF7900;
        background: #FFFFFF;
      }
    }
  }
}
/* 首单返利提示css */
.shop_first_tip{
  min-height: 62rpx;
  margin: 30rpx 6rpx 0;
  border-radius: 16rpx;
  color: #666666;
  background: linear-gradient( 270deg, #FFFFFF 0%, #FFF1F1 100%);
  .shop_process_tip_content{
    display: flex;
    align-items: center;
    padding: 10rpx 12rpx;
    .shop_first_img{
      width: 160rpx;
    }
    .shop_first_text_box{
      flex: 1;
      color: #666666;
      font-size: 22rpx;
      border-radius: 10rpx;
      .tips_text_title{
        line-height: 34rpx;
      }
    }
  }
}

.bottom .btn_item {
  margin-left: 20rpx;
  display: inline-block;
  font-size: 26rpx;
  line-height: 58rpx;
  text-align: center;
  color: #F97632;
  width: 160rpx;
  height: 60rpx;
  border: 1rpx solid #F97632;
  border-radius: 30rpx;
  box-sizing: border-box;
}
/* 订单检测css */
.order_check{
  width: 100%;
  height: 80rpx;
  line-height: 80rpx;
  text-align: center;
  font-size: 28rpx;
  color: #FFFFFF;
  border-radius: 16rpx;
  margin-top: 20rpx;
  background: linear-gradient(270deg, #FEB85A 0%, #FC754A 100%);
}
/* 取消订单 */
.cancel_order{
  font-size: 26rpx !important;
  color: #666666 !important;
  border: 2rpx solid #E7E7E7 !important;
  background: #FFFFFF !important;
}

.btns_box {
  margin-left: 20rpx;
  display: inline-block;
  font-size: 22rpx;
  line-height: 56rpx;
  text-align: center;
  color: #fff;
  width: 150rpx;
  height: 56rpx;
  border-radius: 8rpx;
  box-sizing: border-box;
  margin-top: 10rpx;
  background: #fff linear-gradient(270deg, #FEB85A 0%, #FC754A 100%);
}

.bottom .btn_item:last-child {
  border: 0;
  color: #fff;
  width: 160rpx;
  height: 60rpx;
  background: linear-gradient( 270deg, #FF7900 0%, #FF7900 100%);
}
/* 头部分享css */
.bottom .top_share_box {
  width: 160rpx;
  border: 0;
  position: relative;
  display: inline-block;
  margin-left: 20rpx;
  margin-top: -38rpx;
  & .tishi_box {
    width: 140rpx;
    height: 36rpx;
    line-height: 32rpx;
    text-align: center;
    position: absolute;
    top: 0;
    left: 10rpx;
    & .tishi_text{
      color: #fff;
      font-size: 22rpx;
      position: absolute;
      top: 2rpx;
      left: 12rpx;
      z-index: 1;
    }
  }
  .share_btn{
    line-height: 58rpx;
    text-align: center;
    color: #F97632;
    width: 160rpx;
    height: 60rpx;
    font-size: 26rpx;
    border: 1rpx solid #F97632;
    border-radius: 30rpx;
    box-sizing: border-box;
    background: #FFFFFF;
  }
  @keyframes fadeInOut {
    0%{ opacity: 0; }
  }
}
.bottom .top_share_box view:last-child {
  background: none;
}
/* 微信H5分享提示图片css */
.share_box_shadow {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99999;
  background-color: rgba(0, 0, 0, 0.6);
}
.share_box_shadow image {
  max-width: 80%;
  margin: 10%;
}
/* 按钮分享弹窗css */
.share_box {
  box-sizing: border-box;
  background: linear-gradient( 177deg, #FDEECF 1%, #FFF7E4 75%);
  border-radius: 32rpx 32rpx 0 0;
  height: 700rpx;
  overflow: hidden;
  .text {
    font-size: 28rpx;
    color: #333;
  }
  .share_top{
    width: 100%;
    height: 480rpx;
    padding-bottom: 40rpx;
    position: relative;
    // background: #FFF7E4;

    .share_top_bg{
      width: 100%;
    }
    .share_top_warp{
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      padding: 30rpx 60rpx;
      .share_top_warp_title{
        width: 100%;
        height: 80rpx;
        line-height: 80rpx;
        font-size: 40rpx;
        font-weight: bold;
        color: #222222;
        text-align: center;
        margin: 10rpx 0;
      }
      .share_top_warp_subtitle{
        height: 50rpx;
        line-height: 50rpx;
        font-size: 28rpx;
        text-align: center;
      }
      .share_top_warp_content{
        width: 100%;
      }
    }
  }
  .wechat_box {
    display: flex;
    justify-content: space-between;
    text-align: center;
    padding: 30rpx 0;
    background: #FFFFFF;
    border-radius: 32rpx 32rpx 0 0;
    .small_box {
      flex: 1;
      .complete1 {
        text-align: center;
        background: none;
        border: none;
      }
      & button:after {
        border: none;
        background: none;
      }
      .icon {
        width: 64rpx;
        height: 64rpx;
        margin: 0 auto;

        image {
          width: 100%;
          height: 100%;
        }
      }

      .name {
        font-size: 26rpx;
        color: #333;
        line-height: 40rpx;
        margin-top: 16rpx;
      }
    }
  }
}
/* 查看订单详情 */
.order_detail{

  .order_detail_box{
    padding: 30rpx 30rpx 0 30rpx;
    .order_detail_box_title{
      height: 80rpx;
      line-height: 80rpx;
      text-align: center;
      font-size: 32rpx;
      color: #3D3D3D;
    }
    .order_detail_shop{
      height: 320rpx;
      background: #FFFFFF;
      padding: 0 30rpx;
      border-radius: 16rpx;
      margin-bottom: 20rpx;
    }
    /* 订单进程步骤条 */
    .order_detail_steps{
      height: calc(100% - 400rpx);
      background: #FFFFFF;
      padding: 30rpx 30rpx 0 30rpx;
      border-radius: 16rpx 16rpx 0 0;
      .steps_line{
        height: 100%;
        width: 2rpx;
      }
      .steps_content{
        padding-left: 20rpx;
        .steps_item{
          position: relative;
          padding-bottom: 20rpx;
          padding-left: 30rpx;
          border-left: 1rpx dashed #D9D9D9;
          .steps_time{
            position: absolute;
            top: -8rpx;
            left: -14rpx;
            display: flex;
            align-items: center;
            .steps_round{
              width: 20rpx;
              height: 20rpx;
              border-radius: 50%;
              background: #FFFFFF;
              border: 2rpx solid #D3D3D3;
            }
            .steps_round_icon{
              width: 32rpx;
              height: 32rpx;
            }
            .steps_time_text{
              padding-left: 30rpx;
              font-size: 28rpx;
              color: #888888;
              line-height: 40rpx;
            }
          }
          .steps_title{
            padding-top: 40rpx;
            padding-left: 10rpx;
            padding-bottom: 20rpx;
            font-size: 26rpx;
            color: #888888;
            line-height: 40rpx;
          }
          .steps_desc{
            margin-left: 10rpx;
            font-size: 24rpx;
            color: #FF7900;
            line-height: 40rpx;
            padding: 10rpx 20rpx;
            background: #FFF9F1;
            border-radius: 8rpx;
          }
        }
        .steps_zero{
          padding-top: 20rpx;
          & .steps_time{
            top: -4rpx;
            left: -16rpx;
          }
        }
      }
    }
  }
}
/* 修改订单号弹窗css */
.edit_order_box{
  padding: 20rpx 30rpx;
  .edit_order_title{
    font-size: 32rpx;
    color: #333;
    text-align: center;
    line-height: 80rpx;
    margin-bottom: 30rpx;
  }
  .edit_order_content{
    margin-bottom: 30rpx;
    .edit_order_content_inp{
      border: 1px solid #EAEAEA;
      border-radius: 16rpx;
      padding: 10rpx 10rpx;
      overflow: hidden;
      .choice_right {
        width: 88rpx;
        height: 52rpx;
        font-size: 24rpx;
        color: #FFFFFF;
        line-height: 52rpx;
        text-align: center;
        background: linear-gradient( 270deg, #FF8118 0%, #FF5429 100%);
        border-radius: 12rpx;
      }
    }

  }
  .edit_order_btn{
    padding: 20rpx 30rpx;
    .edit_order_btn_text{
      width: 100%;
      height: 80rpx;
      line-height: 80rpx;
      color: #FFFFFF;
      font-size: 32rpx;
      text-align: center;
      background: linear-gradient( 270deg, #FF8118 0%, #FF5429 100%);
      border-radius: 200rpx;
    }
  }
}
.pingjia {
  font-size: 24rpx;
  color: #555;
  line-height: 40rpx;
}


.pingjia > view:nth-child(2) {
  color: #666666;
}

.pingjia_box {
  box-sizing: border-box;
  padding: 10rpx 20rpx;
}

.bohui_bg {
  padding: 10rpx 20rpx;
  background: #FFF9F1;
  border-radius: 16rpx;
}

.bohui_bg view {
  color: #FF7900;
}

.box-content {
  background: #F8F8F8;
  border-radius: 20rpx 20rpx 0 0;

  .box-title {
    width: 100%;
    height: 130rpx;
    line-height: 130rpx;
    align-items: center;
    text-align: center;
    font-size: 32rpx;
  }

  .box-item {
    display: flex;
    font-size: 32rpx;
    height: 120rpx;
    line-height: 120rpx;
    align-items: center;
    background: #fff;
    border-radius: 16rpx;
    text-align: center;
    margin: 0 30rpx 30rpx 30rpx;
  }

  .box-item-content-name {
    flex: 1;
    text-align: left;
  }

  .to-shop {
    background: #FC4106;
    color: white;
    border-radius: 5rpx;
    font-size: 22rpx;
    margin-left: 10rpx;
    padding: 2rpx 6rpx;
  }

  .icon-content1 {
    border-radius: 50%;
    padding: 10rpx;
    margin: 0 30rpx 0 30rpx;
    background: #F8F8F8;
  }

  .icon-content {
    margin: 0 20rpx;
  }
}

.ewm-content {
  margin-top: -460rpx;
  width: 600rpx;
  height: 200rpx;
  border-radius: 20rpx 20rpx 0 0;
  background: white;

  .top-img {
    width: 600rpx;
    height: 600rpx;
    border-radius: 20rpx 20rpx 0 0;
  }

  .erm-content {
    background: white;
    border-radius: 0 0 20rpx 20rpx;

    .erm-content-name {
      background: white;
      padding: 30rpx;
      font-size: 32rpx;
      font-weight: bold;
    }

    .line {
      width: 200rpx;
      background: black;
      height: 2rpx;
      margin: 0 30rpx;
    }

    .erm-content-bottom {
      display: flex;
      font-weight: 600;
      font-size: 28rpx;
      padding: 30rpx;
      align-items: center;

      .right {
        flex: 1;
      }

      .left {
        image {
          width: 180rpx;
          height: 180rpx;
          background: #f8f8f8;
          border-radius: 50%;
        }
      }
    }
  }

  .icon-content {
    text-align: center;
    width: 68rpx;
    padding: 16rpx;
    margin: 50rpx auto auto;
    background: #f2f2f2;
    border-radius: 60rpx;
  }
}

.copy-content {
  width: 600rpx;
  border-radius: 20rpx;
  background: white;
  text-align: center;

  .bottom1 {
    .btns_box1 {
      width: 540rpx;
      height: 80rpx;
      background: linear-gradient(270deg, #FEB85A 0%, #FC754A 100%);
      border-radius: 50rpx;
      font-size: 26rpx;
      color: #fff;
      line-height: 80rpx;
      text-align: center;
    }

    .box-item {
      display: flex;
      font-size: 28rpx;
      align-items: center;
      width: 370rpx;
      margin: 0 auto 38rpx;
      color: #B1B1B1;
      border-radius: 16rpx;
      text-align: center;

      .icon-content1 {
        border-radius: 50%;
        padding: 6rpx;
        background: #F8F8F8;
      }

      .box-item-content-name {
        margin-left: 10rpx;
      }
    }
  }

  .top {
    background: #f8f8f8;
    border-radius: 20rpx;
    padding: 0 30rpx 30rpx;
  }

  .top-img {
    height: 200rpx;
    width: 200rpx;
    margin: 60rpx auto auto;
    border-radius: 30rpx;
  }

  .address {
    color: #888888;
    margin-top: 20rpx;
    font-size: 26rpx;
  }

  .copy-content-center {
    .copy-content-name {
      padding: 30rpx 0 20rpx;
      font-size: 32rpx;
      font-weight: 600;
    }

    .vip-content {
      text-align: center;

      .vip_text {
        font-size: 26rpx;
        color: #333;
        font-weight: bold;
        margin-right: 26rpx;

        text {
          color: #FE874B;
        }
      }
    }

  }

}

.desc_text1 {
  box-sizing: border-box;
  padding: 30rpx 30rpx 0;
  font-size: 30rpx;
  color: #AAAAAA;
  line-height: 56rpx;
  text-align: left;

  text {
    color: #F97632;
    text-align: left;
  }
}

.save_order_no {
  padding: 0 20rpx;
  font-size: 26rpx;
  .choice_right{
    width: 88rpx;
    height: 40rpx;
    font-size: 24rpx;
    color: #FFFFFF;
    line-height: 40rpx;
    text-align: center;
    background: linear-gradient( 270deg, #FFB30C 0%, #FD7C22 100%);
    border-radius: 8rpx;
  }
  .edit_right{
    width: 100rpx;
    height: 40rpx;
    font-size: 24rpx;
    color: #888888;
    line-height: 40rpx;
    display: flex;
    align-items: center;
  }
}

</style>
